<template>
	<view>
		<view class="top-banner">
			感谢您为缘诉平台提供的良好的改进建议，缘诉致力于打造符合当地交友文化的新生态平台。本平台将不定期进行版本更新，您的建议若被采纳 </view>
		<view class="content">
			您的建议：
			<view class="uni-textarea">
				<textarea v-model="advice" placeholder="请输入您的建议..." />
			</view>
			<view class="btn" @click="submit">
				提交
			</view>
		</view>
	</view>
</template>

<script>
	import {
		url,
		request,
		login
	} from '@/service/api.js'
	export default {
		data() {
			return {
				advice: '',
				image: ''
			};
		},
		methods: {
			submit() {
				if (!this.advice) {
					uni.showToast({
						title: '请输入内容后提交',
						icon: "error"
					})
					return
				}
				request(url.postAdvice, 'post', {
					proposal: this.advice,
					image: this.image
				}).then(res => {
					if (res.status === 200) {
						uni.showToast({
							title: '提交成功',
							icon: "none"
						})
						setTimeout(() => {
							uni.navigateBack()
						}, 2000)
					} else {
						uni.showToast({
							title: res.msg,
							icon: "none"
						})
					}
				}).catch(err => {
					uni.showToast({
						title: err.msg,
						icon: "none"
					})
				})
			}
		}
	}
</script>

<style lang="less">
	* {
		box-sizing: border-box;
	}

	.content {
		overflow: hidden;
		margin-top: 10px;
		height: 80vh;
		background: #fff;
		padding: 15px;

		.uni-textarea {
			padding: 25px 0;

			textarea {
				width: 100%;
				border: 1px solid #dcdcdc;
				border-radius: 3px;
			}
		}
	}

	.top-banner {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		background: linear-gradient(-41deg, rgba(49, 104, 174, 0.57), rgba(145, 83, 188, 0.57));
		font-size: 13px;
		font-family: SimHei;
		color: #FFFFFF;
		line-height: 19px;
		padding: 15px;
	}

	.btn {
		margin: auto;
		margin-top: 40px;
		width: 100%;
		height: 35px;
		background: #FC9380;
		border-radius: 5px;
		font-size: 17px;
		color: #FFFFFF;
		line-height: 23px;
		display: flex;
		align-items: center;
		justify-content: center;
	}
</style>
